<script setup lang="ts">
import { IPackNifi } from 'src/inter';
import { ref,computed } from 'vue';
import {t} from "../../i18n/index"

const {cell,nifi} = defineProps<IPackNifi.CellProps>();
//
const mode = computed(() => nifi.graph.mode.value)
const status = ref<IPackNifi.NIFI_CELL_STATUS>(cell.prop('status'))
const sn = nifi.graph?.getSelectedCells().length || 0;
//
cell.on('change:status',({current}:any) => {
    status.value = current;
})

// 居中，选择，编辑，查看，删除，刷新，
const handleCopy = (cell?:any) => {nifi.Select.copy(cell)}
const handleBatchDelete = () => {nifi.Select.batchDelete()}
const handleCenter = () => {nifi.graph.centerCell(cell)}
const handleRefresh = () => {nifi.cells.processors.refresh(cell)}
const handleProvance = () => {nifi.cells.processors.provance(cell)}
const handleView = () => {nifi.cells.processors.view(cell)}
const handleEdit = () => {nifi.cells.processors.edit(cell)}
const handleDelete = () => {nifi.cells.processors.del(cell)}
const handleDisable = () => {nifi.cells.processors.disable(cell)}
const handleEnable = () => {nifi.cells.processors.enable(cell)}
const handleRun = () => {nifi.cells.processors.run(cell);}
const handleRunOnce = () => {nifi.cells.processors.runOnce(cell)}
const handleStop = () => {nifi.cells.processors.stop(cell)}
const handleCreateTemplate = () => {}
// const handleCopy = () => {}

</script>

<template>
    <!-- 多选菜单 -->
    <div v-if="sn > 1 && mode != 'prod'" class="w-fit h-fit">
        <div class="flex items-center icon-btn" @click="handleCopy"><i></i><span>{{t('cells-contextmenu-copy')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleBatchDelete"><i></i><span>{{t('cells-contextmenu-deletes')}}</span></div>
    </div>
    <!-- 非多选菜单 -->
    <div v-else class="relative w-fit gap-x-20px max-h-240px flex flex-col flex-wrap">
        <!-- 公共方法 -->
        <div class="flex items-center icon-btn" @click="handleCenter"><i></i><span>{{t('cells-contextmenu-center')}}</span></div>
        <div class="flex items-center icon-btn" @click="handleRefresh"><i></i><span>{{t('cells-contextmenu-refresh')}}</span></div>
        <div class="h-1px bg-gray-200 m-y-4px"></div>
        <div class="flex items-center icon-btn" @click="handleProvance"><i></i><span>{{t('cells-contextmenu-provance')}}</span></div>
        <!--  -->
        <div v-if="mode == 'prod' || status == 'Running'" class="h-1px  bg-gray-200 m-y-4px"></div>
        <div v-if="mode == 'prod' || status == 'Running'" class="flex items-center icon-btn" @click="handleView"><i></i><span>{{t('cells-contextmenu-view')}}</span></div>
        <!--  -->
        <div v-if="mode == 'dev' && status != 'Running'" class="h-1px  bg-gray-200 m-y-4px"></div>
        <div v-if="mode == 'dev' && status != 'Running'" class="flex items-center icon-btn" @click="handleEdit"><i></i><span>{{t('cells-contextmenu-edit')}}</span></div>
        <div v-if="mode == 'dev' && status != 'Running'" class="flex items-center icon-btn" @click="handleDelete"><i></i><span>{{t('cells-contextmenu-delete')}}</span></div>
        <!--  -->
        <div v-if="mode == 'dev' && ['Stopped','Running'].includes(status)" class="h-1px  bg-gray-200 m-y-4px"></div>
        <div v-if="mode == 'dev' && status == 'Stopped'" class="flex items-center icon-btn" @click="handleRun"><i></i><span>{{t('cells-contextmenu-run')}}</span></div>
        <div v-if="mode == 'dev' && status == 'Stopped'" class="flex items-center icon-btn" @click="handleRunOnce"><i></i><span>{{t('cells-contextmenu-runonce')}}</span></div>
        <div v-if="mode == 'dev' && status == 'Running'" class="flex items-center icon-btn" @click="handleStop"><i></i><span>{{t('cells-contextmenu-stop')}}</span></div>
        <!--  -->
        <div v-if="mode == 'dev' && ['Stopped','Invalid','Disabled'].includes(status)" class="h-1px  bg-gray-200 m-y-4px"></div>
        <div v-if="mode == 'dev' && ['Stopped','Invalid'].includes(status)" class="flex items-center icon-btn" @click="handleDisable"><i></i><span>{{t('cells-contextmenu-disable')}}</span></div>
        <div v-if="mode == 'dev' && status == 'Disabled'" class="flex items-center icon-btn" @click="handleEnable"><i></i><span>{{t('cells-contextmenu-enable')}}</span></div>
        <!--  -->
        <div v-if="mode == 'dev'" class="h-1px  bg-gray-200 m-y-4px"></div>
        <!-- <div v-if="mode == 'dev'" class="flex items-center icon-btn" @click="handleCreateTemplate"><i></i><span>创建模板</span></div> -->
        <div v-if="mode == 'dev'" class="flex items-center icon-btn" @click="handleCopy(cell)"><i></i><span>{{t('cells-contextmenu-copy')}}</span></div>
        <!-- <div class="flex items-center icon-btn"><i></i><span></span></div> -->
        <!--  -->
    </div>
</template>